import React, { Component } from 'react';
import PropTypes from 'prop-types';

/**
 * 高阶组件-权限控制
 */
const wrapAuth = (WrappedComponent, componentAccessableAuthority) => {
  // 返回一个新组件，将被控组件包含其中
  return class extends Component {
    /**
     * 定义props
     */
    static propTypes = {
      // 用户拥有的权限
      userOwnedAuthorities: PropTypes.array.isRequired,
    }

    constructor(props) {
      super(props);
    }

    /**
     * 鉴权(自己需要的权限与用户拥有的权限对比)
     */
    checkUserAuthorityAccessable = () => {
      // 用户拥有的权限对比
      const { userOwnedAuthorities } = this.props;
      // 拥有的权限中，是否包含组件渲染需要的权限
      return userOwnedAuthorities.includes(componentAccessableAuthority);
    }

    render() {
      // 如果用户没有该组件的访问权限
      if(!this.checkUserAuthorityAccessable()) return null;

      // 如果有权限 
      return (
        <WrappedComponent { ...this.props } />
      );
    }

  }; 

}

export { wrapAuth };